import BaseGroup from '@/components/js/BaseGroup'
import { COMPONENT_TYPES } from '@/common/const-wb'
import { addEvent, removeEvent } from '@/plugins/dom'
import { EventBus } from '@/store'
import { CONTROL_TYPES } from '@/common/const-wb'
import { getCompIdByParam } from '@/plugins/utils'

export default class ClickSpeedPK extends BaseGroup {
  constructor() {
    super();
    //子类覆盖
    this.clickCount = 0;
    this.durationTime = 3;//持续时间10秒
    this.clickTotal = 6;//10秒超过10次就计数，赢得这次胜利
    this.isStartTime = true;
    this.isCompleteClick = false;//处理成功的函数是否执行过
  }
  
  get numberData(){
    return this.wbData;
  }

  start(){
    //{"time":5,"count":15,"triggerRelateCompId":"d441361a-d1ab-43db-b44b-7fcebc3000c9","successPopId":3,"failPopId":4} time 持续时间 count 在规定的时间内点击大于等于就计数，赢得这次胜利
    this.durationTime = this.item.interactionData.injectJsClassObj.time;
    this.clickTotal = this.item.interactionData.injectJsClassObj.count;

    this.initFilterComponents(COMPONENT_TYPES.wb_bg);
    this.addClickEvent();
  }

  addClickEvent(){
    _.forEach(this.filterComponents, (compData) => {
      if(compData.cid == COMPONENT_TYPES.wb_btn || compData.cid == COMPONENT_TYPES.wb_bg){
        let btn = compData.vueContainer.$refs.btn && compData.vueContainer.$refs.btn.$el || compData.vueContainer.$refs.bg && compData.vueContainer.$refs.bg.$el;
        this.onBtnClick = this.onBtnClick.bind(this);
        addEvent(btn, "click", this.onBtnClick);
      }
    })
  }

  onBtnClick(e){
    e.stopPropagation();
    if(this.isCompleteClick){
      return
    }
    let btn = e.currentTarget;
    let compId = btn.parentElement.id;
    let compData = this.componentMap[compId];
    let btnVueClass = compData.vueContainer;

    let relateCompId = getCompIdByParam(btnVueClass.commonAttr.relateEventCompId || btnVueClass.commonAttr.relateCompId);
    let numberItemData;
    if(relateCompId){
      numberItemData = this.getVariableItemByRelateCompId(relateCompId, CONTROL_TYPES.number);
      compData = this.componentMap[relateCompId];
    }else{
      numberItemData = btnVueClass.numberItemData;
    }

    // numberItemData.num = 1;

    if(numberItemData && numberItemData.num > 0){
      if(this.isStartTime){
        EventBus.$emit("playImgBounceAnim", { isPlay: true });
        
        this.setTimeoutCb = window.setTimeout(() => {
          this.result(compData.id);
        }, this.durationTime * 1000);
        this.isStartTime = false;
      }

      this.clickCount++;
      let percent = parseInt(this.clickCount/this.clickTotal * 100);
      if(percent >= 100){
        percent = 100;
      }
      EventBus.$emit("clickAddProcess", percent);
      if(this.clickCount >= this.clickTotal){
        this.result(compData.id);
      }
    }else{
      let injectJsClassObj = this.item.interactionData.injectJsClassObj;
      let popId = injectJsClassObj.notEnough;
      if(popId){
        this.showPop(popId);
      }
      return;
    }
    let jumpUrl = 'pk'
    let comType = "click"
    let wModule = "jump"
    this.onPostStatics(e, { comType, wModule,  jumpUrl })
  }

  result(minusCompId){
    if(this.isCompleteClick){
      return
    }else{
      this.isCompleteClick = true;
    }
    //每点击一次就减一次计数
    EventBus.$emit("itemClick", {id: minusCompId, index: 0, e: null});

    window.clearTimeout(this.setTimeoutCb);
    EventBus.$emit("playImgBounceAnim", { isPlay: false });


    //在规定的时间内赢得了胜利，那么就记录一次数据
    let popId = -1;
    let injectJsClassObj = this.item.interactionData.injectJsClassObj;
    if(this.clickCount >= this.clickTotal){
      let triggerRelateCompId = injectJsClassObj.triggerRelateCompId;
      popId = injectJsClassObj.successPopId;
      //成功触发计数排名
      EventBus.$emit("itemClick", {id: triggerRelateCompId, index: 0, e: null});
    }else{
      EventBus.$emit("clickAddProcess", 0);
      popId = injectJsClassObj.failPopId;
    }
    if(popId){
      this.showPop(popId);
    }

    this.isCompleteClick = false;
    this.isStartTime = true;
    this.clickCount = 0;
    EventBus.$emit("clickAddProcess", 0);
  }
  
  getVariableItemByRelateCompId(relateCompId, eventType){
    let itemControls = this.controls[relateCompId];
    let relateCompData = this.componentMap[relateCompId];
    if(itemControls[eventType].data.elements){
      return itemControls[eventType].data.elements[relateCompData.itemIndex]
    }else{
      return itemControls[eventType].data;
    }
  }

  destroy(){
    super.destroy();
    
    this.isCompleteClick = false;
    this.clickCount = 0;
    this.isStartTime = true;
    _.forEach(this.filterComponents, (compData) => {
      if(compData.cid == COMPONENT_TYPES.wb_process){
        //待处理
      }else if(compData.cid == COMPONENT_TYPES.wb_btn){
        let btn = compData.vueContainer.$refs.btn.$el;
        removeEvent(btn, "click", this.onBtnClick);
      }
    })
  }

}